<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>个人中心-收货地址</title>
		<link rel="stylesheet" href="./Public/Home/bootstrap-3.3.5-dist/css/bootstrap.min.css" />
		<script type="text/javascript" src='./Public/Home/jquery.min.js'></script>
		<script type="text/javascript" src='./Public/Home/bootstrap-3.3.5-dist/js/bootstrap.min.js'></script>
		<link rel="stylesheet" href="./Public/Home/css/index.css" />
		<script type="text/javascript" src="./Public/Home/js/index.js"></script>
		<link rel="stylesheet" href="./Public/Home/css/myCenter_common.css" />
		<link rel="stylesheet" type="text/css" href="./Public/Home/css/myCenter_address.css"/>
		<link rel="stylesheet" type="text/css" href="./Public/Home/css/ifont.css"/>
		<script type="text/javascript" src='./Public/Home/js/area.js'></script>
		<script type="text/javascript" src='./Public/Home/js/region_select.js'></script>
		<style type="text/css">
			.create{       
			        width: 100%;
			        height: 100%;
			        position: fixed;
			        background: #000000;
			        z-index: 3;
			        top: 0px;
			        left: 0px;
			        filter:alpha(opacity=50); /*IE滤镜，透明度50%*/
			        -moz-opacity:0.5; /*Firefox私有，透明度50%*/
			        opacity:0.5;/*其他，透明度50%*/
			        display: none;
			
			      }
			      .box{
			        width: 562px;
			        height: 350px;
			        border: 2px solid orangered;
			        background:#FFFFFF;
			        position: fixed;
			        top: 50%;
			        left: 50%;
			        margin-top: -205px;
			        margin-left: -256px;
			        z-index: 5;
			        border-radius: 3px;
			        display:none ;
			      }
			      .box .boxtitle{
			        width: 100%;
			        height: 40px;
			        background: #eee;
			        line-height: 40px;
			      }
			      .box .boxtitle span{
			        float: right;
			        margin-right: 16px;
			        font-size: 24px;
			        line-height: 40px;
			        cursor: pointer;
			        color: #414141;
			      }
			      .bxlef{
			      	position: absolute;
			      	left: 10px;top: 0;
			      }
			      .area{
			      	height: 40px;
			      	line-height: 40px;			      	
			      	margin-left: 10px;
			      }
			      .areas{
			      	font-size: 16px;
			      }
			      .area select{
			      	width: 120px;
			      	height: 26px;
			      	margin-left: 10px;
			      	border: 1px solid #C6C6C6;
			      	border-radius: 5px;
			      }
			      .det{
			      	width: 250px;
			      	height: 26px;
			      	border: 1px solid #C6C6C6;
			      	border-radius: 5px;
			      	margin-left: 10px;
			      }
			      .confirm{
			      	position: absolute;
			      	right: 20px;
			      	bottom: 10px;
			      	font-size: 18px;
			      	line-height: 18px;
			      	padding: 8px;
			      	border-radius: 5px;
			      	background: orangered;
			      	color: #FFFFFF;
			      }
		</style>
		<script type="text/javascript">
			$(function(){
				//初始化方法
				area.init('area');
				//修改的时候默认被选中效果				
			})
		</script>	
		
	</head>
	<body>
		<!--点击修改-->
		<div class="create">
		</div>
		<form action="{{U('Center/editAddress')}}" method="post">
			<div class="box">
			    <div class="boxtitle">
			      <span class="close">X</span><span class="bxlef">修改收货地址</span>
			    </div>
			    <div class="area">
			    		    	
				   	<span class="areas">所在地区</span>
				   	&nbsp;&nbsp;&nbsp;	
				   	<select name="province"  id="zone1" class="provincee">
				   	</select>
				   	<select name="city" id="zone2" class="citye">
				   	</select>
				   	<select name="town" id="zone3" class="towne">
				   	</select>
			    </div>
			    
			    <div class="area">
			    	<span class="areas">详细地址</span>&nbsp;&nbsp;&nbsp;&nbsp;
			    	<input type="text" name="detail" class="det detls" value=""/>
			    </div>
			    <div class="area">
			    	<span class="areas">收货人姓名</span>
			    	<input type="text" name="customer" class="det detcus" value=""/>
			    </div>
			    <div class="area">
			    	<span class="areas">收货人手机</span>
			    	<input type="text" name="telephone" class="det detel" value=""/>
			    </div>
			    <div class="area">
			    	<span class="areas">邮政编码</span>&nbsp;&nbsp;&nbsp;&nbsp;
			    	<input type="text" name="cardcodes" class="det detcode" value=""/>
			    </div>
			    <div class="area">
			    	<span class="areas">收货时间</span>&nbsp;&nbsp;&nbsp;&nbsp;
			    	<select name="taketime" value="" class="detake">
						<option value="">请选择</option>
						<option value="不限时间">不限时间</option>
						<option value="周一至周五">周一至周五</option>
						<option value="周六周日">周六周日</option>
					</select>
			    </div>
				<div class="checkbox" style="margin-left: 15px;">
				  <label>
				    <input type="checkbox" value="1" name="statu">
				    设为默认地址
				  </label>
				</div>
				<input type="hidden" name="did" class="dids" value=""/>
				<input type="submit" value="确认修改" class="confirm"/>
			</div>	
			
		</form>
		{{include file="VIEW_PATH/Common/header.php"}}
		<!--公共左侧开始-->
		<div class="_w100">
			<ul class="toper _container">
				<li>您的位置:</li>
				<li><a href="">首页</a><span class="glyphicon glyphicon-menu-right"></span></li>
				<li>我的优购</li>
			</ul>
		</div>
		
		
		<div class="_w100">
			<div class="main _container">
				<div class="first fl">
					<div class="tl"><a href="">我的优购</a></div>
					<ul class="one">
						<li class="special">交易中心</li>
						<li><a href="{{U('Center/myindent')}}" >我的订单</a></li>
						<li><a href="">我的收藏</a></li>
						<li><a href="">我的预约</a></li>
						<li><a href="">商品评论/晒单</a></li>
						<li><a href="">站内消息<span>(0)</span></a></li>
					</ul>
					<ul class="one">
						<li class="special">我的资产</li>
						<li><a href="" >我的优惠券</a></li>
						<li><a href="">我的礼品卡</a></li>
						<li><a href="">我的积分</a></li>
					</ul>
					<ul class="one">
						<li class="special">个人设置</li>
						<li>
							<!-- 模态框的声明 -->
							<div class="modal fade" id="myModal" tabindex="-1" id="dv">
								<!-- 模态框窗口声明 -->
								<div class="modal-dialog modal-default">
									<!-- 内容声明 -->
									<div class="modal-content">
										<div class="modal-header">
											<button class="close" data-dismiss="modal">&times</button>
											<h4 class="modal-title">会员资料</h4>
										</div>
										<div class="modal-body">			
												<form class="form-horizontal" action="{{U('Center/edit')}}" method="post">
													  <div class="form-group">
													    <label for="inputEmail3" class="col-sm-2 control-label">邮箱</label>
													    <div class="col-sm-10">
													      <input type="email" class="form-control" 
													      	id="inputEmail3" placeholder="Email" value="" name="email">
													    </div>
													  </div>
													  <div class="form-group">
													    <label for="inputPassword3" class="col-sm-2 control-label">
													    	手机
													    </label>
													    <div class="col-sm-10">
													      <input type="text" class="form-control" 
													      	id="inputPassword3" placeholder="手机号" value="" name="mobile">
													    </div>
													  </div>
													  <div class="form-group">
													    <label for="inputPassword3" class="col-sm-2 control-label">
													    	固话
													    </label>
													    <div class="col-sm-10">
													      <input type="text" class="form-control" 
													      	id="inputPassword3" placeholder="固定电话" value="" name="phone">
													    </div>
													  </div>
													  <div class="form-group">
													    <label for="inputPassword3" class="col-sm-2 control-label">
													    	真实姓名
													    </label>
													    <div class="col-sm-10">
													      <input type="text" class="form-control" 
													      	id="inputPassword3" placeholder="" value="" name="username">
													   </div>
													   
													 <div class="form-group">	
														 <label for="inputPassword3" class="col-sm-2 control-label">
														 	性别
														 </label>
														<label class="radio-inline col-sm-2 control-label">
														  <input type="radio" name="sex" 
														  	id="inlineRadio1" value="男"> 男
														</label>
														<label class="radio-inline col-sm-2 control-label">
														  <input type="radio" name="sex" 
														  	id="inlineRadio2" value="女"> 女
														</label>
													 </div>						   
													    <div class="form-group">
													    <label for="inputPassword3" class="col-sm-2 control-label">
													    	出生日期
													    </label>
													   <select class="form-control fl"style="width: 100px;margin-left: 26px;" name="year">
														  <option>1996</option>
														  <option>1995</option>
														  <option>1994</option>
														  <option>1993</option>
														  <option>1992</option>
														  <option>1991</option>
														  <option>1990</option>
														  <option>1989</option>
														  <option>1988</option>
														  <option>1987</option>
														  <option>1986</option>
														  <option>1985</option>
														  <option>1984</option>
														</select>
														<label for="inputPassword3" class="col-sm-1 control-label">年</label>
													   <select class="form-control fl"style="width: 80px;" name="month">
														  <option>1</option>
														  <option>2</option>
														  <option>3</option>
														  <option>4</option>
														  <option>5</option>
														  <option>6</option>
														  <option>7</option>
														  <option>8</option>
														  <option>9</option>
														  <option>10</option>
														  <option>11</option>
														  <option>12</option>							  
														</select>
														<label for="inputPassword3" class="col-sm-1 control-label">月</label>
													   <select class="form-control fl"style="width: 80px;" name="day">
														  <option>1</option>
														  <option>2</option>
														  <option>3</option>
														  <option>4</option>
														  <option>5</option>
														  <option>6</option>
														  <option>7</option>
														  <option>8</option>
														  <option>9</option>
														  <option>10</option>
														  <option>11</option>
														  <option>12</option>
														  <option>13</option>
														  <option>14</option>
														  <option>15</option>
														  <option>16</option>
														  <option>17</option>
														  <option>18</option>
														  <option>19</option>
														  <option>20</option>
														  <option>21</option>
														  <option>22</option>
														  <option>23</option>
														  <option>24</option>
														  <option>25</option>
														  <option>26</option>
														  <option>27</option>
														  <option>28</option>
														  <option>29</option>
														  <option>30</option>
														  <option>31</option>
														</select>
														<label for="inputPassword3" class="col-sm-1 control-label">日</label>
													    </div>	
													   
													  </div>
													  
													  
													  <div class="form-group">
													  	
													  	<label for="inputPassword3" class="col-sm-2 control-label">
													    	地址
													    </label>
													    
													    <select class="form-control fl" style="width: 100px; margin-left: 15px;" name="province"  id="area1">
														  
														</select>
														
														<select class="form-control fl" style="width: 120px; margin-left: 30px;" name="city" id="area2">
														  
														</select>
														
														<select class="form-control fl" style="width: 120px; margin-left: 30px;" name="town" id="area3">
														  
														</select>
													  </div>
													  
													  
													  <div class="form-group">
													    <label for="inputPassword3" class="col-sm-2 control-label">
													    	详细地址
													    </label>
													    <div class="col-sm-10">
													      <input type="text" class="form-control" 
													      	id="inputPassword3" placeholder="" name="detail">
													    </div>
													  </div>
													   <div class="form-group">
													    <label for="inputPassword3" class="col-sm-2 control-label">
													    	邮政编码
													    </label>
													    <div class="col-sm-10">
													      <input type="text" class="form-control" 
													      	id="inputPassword3" placeholder="" name="postcode">
													    </div>
													  </div>
													 <div class="modal-footer">
														<button class="btn btn-primary">确认</button>
													</div>
												</form>
										</div>
										
									</div>
								</div>
							</div>
							<button class="btn btn-success" data-toggle="modal" data-target="#myModal" 
								style="background: white; border: none;color: #666666;height: 26px;
								padding-left: 0px;">
								个人资料
							</button>	
							
						</li>
						<li><a href="">安全设置</a></li>
						<li><a href="{{U('Center/myaddress')}}">我的收货地址</a></li>
					</ul>
					<ul class="one">
						<li class="special">售后服务</li>
						<li><a href="" >我的退换货</a></li>
						<li><a href="">申请退换货</a></li>
					</ul>
				</div>
				<!--公共左侧结束-->
				<div class="ad_rig fr">
					<h4>我的收货地址</h4>
							<!-- 模态框的声明 -->
							<div class="modal fade" id="myModalt" tabindex="-1" id="dv">
								<!-- 模态框窗口声明 -->
								<div class="modal-dialog modal-default">
									<!-- 内容声明 -->
									<div class="modal-content">
										<div class="modal-header">
											<button class="close" data-dismiss="modal">&times</button>
											<h4 class="modal-title">增加新的收货地址</h4>
										</div>
										<div class="modal-body">			
												<form class="form-horizontal" action="{{U('Center/addnewaddress')}}" method="post">
													 
													  <div class="form-group">
													    <label for="inputPassword3" class="col-sm-2 control-label">
													    	收货人姓名
													    </label>
													    <div class="col-sm-10">
													      <input type="text" class="form-control" name="customer"
													      	id="inputPassword3" placeholder="请输入姓名" value="">
													    </div>
													  </div>
													  <div class="form-group">
													    <label for="inputPassword3" class="col-sm-2 control-label">
													    	收货人手机
													    </label>
													    <div class="col-sm-10">
													      <input type="text" class="form-control" name="telephone"
													      	id="inputPassword3" placeholder="请输入手机号" value="">
													      	<label for="inputPassword3" 
													      		class="col-sm-12 control-label">
													      	</label>
													      	<label for="inputPassword3" 
													      		class="col-sm-12 control-label">
													      	</label>
													   </div>
													    
													   
													    <div class="form-group">
													    								  																		   
													   <div class="control-group">

														  <label class="control-label col-sm-2 control-label" for="location_p">
														  	详细地址
														  </label>													
														  <div class="controls">													
														    <select name="province"  id="zones1"
														    class="form-control fl"style="width: 145px; margin-left: 26px;">													
														    </select>
														    <select name="city" id="zones2"
														    class="form-control fl"style="width: 145px; margin-left: 10px;">													
														    </select>
														    <select name="town" id="zones3"
														    class="form-control fl"style="width: 145px; margin-left: 10px;">													
														    </select>										
													    	<script type="text/javascript">
													    		//初始化方法
																area.init('zones');
													    	</script>
													
														  </div>
													
														</div>
														
													    </div>	
													  
													  </div>
													  
													   <div class="form-group">
													    <label for="inputPassword3" class="col-sm-2 control-label">
													    	详细地址
													    </label>
													    <div class="col-sm-10">
													      <input type="text" class="form-control" 
													      	id="inputPassword3" placeholder="" name="detail">
													    </div>
													  </div>
													   <div class="form-group">
													    <label for="inputPassword3" class="col-sm-2 control-label">
													    	邮政编码
													    </label>
													    <div class="col-sm-10">
													      <input type="text" class="form-control" 
													      	id="inputPassword3" placeholder="" name="cardcodes">
													    </div>
													  </div>
													 <div class="modal-footer">
														<button class="btn btn-info">确认</button>
													</div>
												</form>
										</div>
										
									</div>
								</div>
							</div>
							<button class="btn btn-warning" data-toggle="modal" data-target="#myModalt" 
								style="position: absolute;right: 0px;top:0px;">
								<span class="iconfont">&#xe622;</span>&nbsp;&nbsp;新增收货地址
								
							</button>
							
					
					
					<ul class="myad">
						<li>收货人</li>
						<li>收货人手机</li>
						<li>所在地区</li>
						<li>详细地址</li>						
						<li>操作</li>
					</ul>
					{{foreach from="$addressData" key="$k" value="$v"}}
					<ul class="myad ad_lis">
						<li>{{$v['customer']}}</li>
						<li>
							{{$v['telephone']}}
						</li>
						<li>{{$v['zone']}}</li>						
						<li>
							{{$v['detail']}}
						</li>						
						<li>
							{{if value="$v['statu']==1"}}
							<span><a href="javascript:;" num="{{$k}}" class="df set{{$k}}">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;默认地址</a></span>&nbsp;|
							{{else}}
							<span>
								<a href="javascript:;" class="set set{{$k}}" num="{{$k}}">设为默认地址</a>
							</span>&nbsp;|
							{{endif}}
							<!--隐藏域要放到if else外面-->
							<input type="hidden" name="" class="did" value="{{$v['did']}}"/>
							<span><a href="javascript:;" class="edit">修改</a></span>&nbsp;|
							<span class="iconfont"><a href="javascript:if(confirm('确认要删除吗？')) location.href='{{U('Center/del',array('did'=>$v['did']))}}';">&#xe60c;</a></span>
						</li>
					</ul>
					{{endforeach}}
				</div>									
			</div>
		</div>
	<!--公共底部--> 
	<script type="text/javascript">
		//点击设置默认地址提交的地址
		var set_path = "{{U('Center/setAddress')}}";
		//点击设为默认地址发送异步，异步设置
		$(function(){
			$('.ad_rig').on('click','.set',function(){
				var did = $(this).parents('span').siblings('.did').val();
				var ids = $(this).attr('num');
				//发送异步
					$.ajax({
						type:"post",
						url:set_path,
						data:{id:did},
						dataType:'json',
						success:function(phpData){
							if(phpData){
								alert('设置成功');							
								$('.df').html('设为默认地址').addClass('set').removeClass('df');
								$('.set'+ids).html('&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;默认地址').addClass('df').removeClass('set');
							}
						}
					});
			})
		})
		
		//点击修改地址时异步查询旧地址的提交路径
		var query_path = "{{U('Center/queryOldAddress')}}";
		//点击修改地址时遮罩和弹窗出现
		$('.edit').click(function(){
			var id = $(this).parent('span').siblings('.did').val();
			$('.box').show('slow');
			$('.create').show('solw');
			//把地址的did赋值给隐藏域，编辑方法需要知道did
			$('.dids').val(id);
			$.ajax({
				type:"post",
				url:query_path,
				data:{id:id},
				dataType:'json',
				success:function(phpData){
					if(phpData){//将返回来的旧地址数据显示出来
						$('.detls').val(phpData.addresses[3]);
						$('.detcus').val(phpData.customer);
						$('.detel').val(phpData.telephone);
						$('.detcode').val(phpData.cardcodes);
						if(phpData.addresses){//让收货人原来的地址被选中
							area.init('zone');
							area.selected(phpData.addresses[0],phpData.addresses[1],phpData.addresses[2]);
						}
						//显示收货时间
						var taketime = phpData.taketime;
						$('.detake').val(taketime);
					}
				}
			});
			
		})
		//点击弹窗的关闭按钮
		$('.close').click(function(){
			$('.box').hide('slow');
			$('.create').hide('solw');
		})
	</script>
	{{include file="VIEW_PATH/Common/bottom.php"}}
		
	</body>
</html>
